<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>
<div style="border: 1px red solid;width: 600px;height: 100px;margin: 0 auto;">　
    用户名：<input type="text" id="username"><span id="sp"></span><br>
    密码：<input type="password" id="pwd"><span id="sb"></span><br>
    <input type="submit" value="登录" onclick="up()">
</div>

<script type="text/javascript" src="http://mat1.gtimg.com/libs/jquery/1.12.0/jquery.js"></script>
<script>

    function f() {
        if (name.length < 0) {

        }

        if (pwd.length < 0) {
            $('#sb').html('请输入密码')
        }
    }

    function up() {
        var name = $('#username').val()
        var pwd = $('#pwd').val()
        {#console.log(name, pwd)#}
        if (name.length === 0){
            $('#sp').html('请输入帐号')
            $('#sp').css('color','red')
        }
        else {
            $.ajax({
            type: 'POST',
            url:{% url 'logins' %},
            data: ({
                'name': name,
                'pwd': pwd
            }),
            success: function (data, mag) {
                if (data.data === 1) {
                    {#alert('登录成功')#}
                    location.href =
                    {% url 'index' %}

                } else {
                    alert(data.mag)
                }

            }

        })
        }

    }
</script>
</body>
</html>